// src/stores/themeAndFont.ts

import { defineStore } from "pinia";

export const useThemeAndFontStore = defineStore("themeAndFont", {
  state: () => ({
    theme: localStorage.getItem("theme") || "light",
    font: localStorage.getItem("font") || "kai",
  }),
  actions: {
    toggleTheme() {
      this.theme = this.theme === "light" ? "dark" : "light";
      localStorage.setItem("theme", this.theme);
      document.documentElement.setAttribute("data-theme", this.theme);
    },
    toggleFont(newFont: string) {
      this.font = newFont;
      localStorage.setItem("font", this.font);
      document.documentElement.setAttribute("data-font", this.font);
    },
  },
});
